<template>
	<div id="app">
		<audio src="static/ring.wav" loop id="ringaudio"></audio>
		<router-view />
	</div>
</template>

<script>
export default {
	name: 'App',
	mounted() {
		/**
		 * 页面触发 onbeforeunload 事件时进入
		 * 1）在页面被关闭前会进入
		 * 2）方法有返回值时才会弹框
		 * 3）方法返回的值与页面最终是否被关闭无关，即返回什么值都不会影响
		 */
		window.onbeforeunload = event => {
			console.log('准备离开网页：' + new Date(), event);
			setTimeout(beforeloadResult, 1000);
		};

		window.addEventListener('unload', () => {
			if (this.$route.path === '/input') {
				sessionStorage.setItem('username', '');
				sessionStorage.setItem('idcard', '');
				sessionStorage.setItem('mobile', '');
				sessionStorage.setItem('category', '');
			} else if (this.$route.path === '/takephoto') {
				sessionStorage.setItem('selfimg', '');
				sessionStorage.setItem('idcardFront', '');
				sessionStorage.setItem('idcardBack', '');
				sessionStorage.setItem('bankImg', '');
				sessionStorage.setItem('address', '');
				sessionStorage.setItem('company', '');
				localStorage.setItem('userInfoFormId', '');
			} else {
				sessionStorage.setItem('username', '');
				sessionStorage.setItem('idcard', '');
				sessionStorage.setItem('mobile', '');
				sessionStorage.setItem('selfimg', '');
				sessionStorage.setItem('idcardFront', '');
				sessionStorage.setItem('idcardBack', '');
				sessionStorage.setItem('bankImg', '');
				sessionStorage.setItem('address', '');
				sessionStorage.setItem('company', '');
				sessionStorage.setItem('category', '');
				localStorage.setItem('userInfoFormId', '');
			}
		});
		/**
		 * 只要能进入此方法，则表示用户并没有离开页面
		 */
		function beforeloadResult() {
			console.log('not leave：' + new Date());
		}
	}
};
</script>

<style>
#app {
	font-family: 'Avenir', Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-align: center;
	color: #2c3e50;
	width: 100%;
}
html,
body,
#app {
	height: 100%;
}
</style>
